<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %>    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <link rel="stylesheet" type="text/css" href="../../css/style_scanning.css"/>
    <%--<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>--%>
    <%--<script src="../../js/jquery-1.6.4.min.js"></script>--%>
    <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>

    <script>

        // When the document loads do everything inside here ...
        $(document).ready(function() {

            // When a link is clicked
            $("a.tab").click(function () {

                // switch all tabs off
                $(".active").removeClass("active");

                // switch this tab on
                $(this).addClass("active");

                // slide all elements with the class 'content' up
                $(".content").slideUp();

                // Now figure out what the 'title' attribute value is and find the element with that id.  Then slide that down.
                var content_show = $(this).attr("title");
                $("#" + content_show).slideDown();

            });

        });

        function tabSwitch(new_tab, new_content) {

            document.getElementById('content_1').style.display = 'none';
            document.getElementById('content_2').style.display = 'none';
            document.getElementById('content_3').style.display = 'none';
            document.getElementById(new_content).style.display = 'block';


            document.getElementById('tab_1').className = '';
            document.getElementById('tab_2').className = '';
            document.getElementById('tab_3').className = '';
            document.getElementById(new_tab).className = 'active';

        }

        function tabSwitch_2(active, number, tab_prefix, content_prefix) {

            for (var i = 1; i < number + 1; i++) {
                document.getElementById(content_prefix + i).style.display = 'none';
                document.getElementById(tab_prefix + i).className = '';
            }
            document.getElementById(content_prefix + active).style.display = 'block';
            document.getElementById(tab_prefix + active).className = 'active';

        }

    </script>

</head>
<body>

<H3 style="text-align:center;">Scanning API</H3>
<br />
<%-------------------- Body Start ---------------------%>

<div id="tabbed_box_1" class="tabbed_box">

    <div class="tabbed_area">

        <ul class="tabs">
            <li><a href="#" title="content_1" class="tab active">RMI</a></li>
            <li><a href="#" title="content_2" class="tab">SOAP</a></li>
            <li><a href="#" title="content_3" class="tab">REST</a></li>
        </ul>

        <div id="content_1" class="content">
            <ul>
                <!-- RMI Contains Start-->
                <br/>
                <table>
                    <tr>
                        <td style="width:150px;">RMI Field select 01</td>
                        <td style="width:250px">
                            <select name="title1" id="title1" style="width:220px">
                                <option selected="selected"></option>
                                <option>option 01</option>
                                <option>option 02</option>
                                <option>option 03</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>RMI Field select 02</td>
                        <td>
                            <input type="text" value="" name="APIname" id="APIname" style="width:220px">
                        </td>
                    </tr>
                    <tr>
                        <td>RMI Field select 03</td>
                        <td>
                            <input type="text" value="" name="APIname" id="APIname" style="width:220px">
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <input type="submit" id="app_button_subsction"   name=Scan value="Scan"  class="app_button">
                        </td>
                    </tr>
                </table>
                <!-- RMI Contains End-->
            </ul>
        </div>
        <div id="content_2" class="content">
            <ul>
                <!-- SOAP Contains Start-->
                <br/>
                <table>
                    <tr>
                        <td style="width:150px;">SOAP Field select 01</td>
                        <td style="width:250px">
                            <select name="title1" id="title1" style="width:220px">
                                <option selected="selected"></option>
                                <option>option 01</option>
                                <option>option 02</option>
                                <option>option 03</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>SOAP Field select 02</td>
                        <td>
                            <input type="text" value="" name="APIname" id="APIname" style="width:220px">
                        </td>
                    </tr>
                    <tr>
                        <td>SOAP Field select 03</td>
                        <td>
                            <input type="text" value="" name="APIname" id="APIname" style="width:220px">
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td>
                            <input type="submit" id="app_button_subsction" name="Scan" value="Scan"
                                   class="app_button">
                        </td>
                    </tr>
                </table>
                <!-- SOAP Contains End-->
            </ul>
        </div>
        <div id="content_3" class="content">
            <ul>
                <!-- REST Contains Start-->
		<form:form method="get" commandName="WADLScanModel" action="scanapplication_wadl.htm">
                <table>
                    <tr>
                        <td>System Name:</td>
                        <td>
                            <form:input path="systemName" style="width:120px" />
                        </td>
                    </tr>
                    <tr>
                        <td>Release Version:</td>
                        <td>                            
                            <form:input  path="releaseName" style="width:220px" />
                        </td>
                    </tr>
                    <tr>
                        <td>URL:</td>
                        <td>
                            <form:input path="url" style="width:500px" />
                        </td>
                    </tr>
                    <tr>
                        <td></td>
                        <td></td>
                        <td>
                            <input type="submit" id="app_button_subsction" name="Scan" value="Scan"  class="app_button">
                        </td>
                    </tr>
                </table>
                </form:form>
                <!-- REST Contains End-->
            </ul>
        </div>

    </div>

</div>
<br />
<br />
<br />
<%--------------------- Body End ----------------------%>


<%------------------------ Including the JS ------------------------------%>
<%--<script type="text/javascript" src="../../js/jquery.min.js"></script>--%>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">

    $(function() {

        $('#cd-dropdown').dropdown();

    });

</script>
</body>
</html>
